import React from 'react';
import {Image, ImageStyle} from 'react-native';

// 导入 PNG 图片
import homeIcon from '@/assets/images/tabbar/home.png';
import homeActiveIcon from '@/assets/images/tabbar/home-active.png';
import personalIcon from '@/assets/images/tabbar/personal.png';
import personalActiveIcon from '@/assets/images/tabbar/personal-active.png';

type IconName = 'home' | 'personal';

interface IconProps {
  name: IconName;
  size: number;
  focused?: boolean;
  style?: ImageStyle;
}

const iconMap = {
  home: {
    default: homeIcon,
    active: homeActiveIcon,
  },
  personal: {
    default: personalIcon,
    active: personalActiveIcon,
  },
};

export const Icon: React.FC<IconProps> = ({name, size, focused = false, style}) => {
  const source = focused ? iconMap[name].active : iconMap[name].default;
  return (
    <Image
      source={source}
      style={[
        {
          width: size,
          height: size,
        },
        style,
      ]}
    />
  );
};

export default Icon;